<template>
    <div class="withdraw page">
        <formHeader :title="'提现'" ></formHeader>
        <div class="con">
            <div class="bankCard" @click="turn">
                <div class="info" v-if="flag">
                    <div class="card">{{data.bank+'('+data.accName+')'}}</div>
                    <div class="desc">{{data.number}}</div>
                </div>
                <div class="info" v-else>
                    <div class="card">添加银行卡</div>
                    <div class="desc">提现到新增银行卡</div>
                </div>
                <div class="control">
                    <i class="cubeic-arrow"></i>
                </div>
            </div>
            <div class="input">
                <div class="title">提现金额</div>
                <div class="num">
                    <div class="rmb">¥</div>
                    <input v-model="amount" oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" placeholder="输入金额">
                </div>
            </div>
            <div class="sub" @click="deposit">提现</div>
        </div>
    </div>
</template>

<script>
    import formHeader from '@/components/form-header'
    import eventBus from "@/common/js/eventbus";
    import {deposit} from '@/api/account'
    import {showCorrect} from "../../dialog";
    import {showError} from "../../toast";
    export default {
        name: "index",
        components:{formHeader},
        data(){
            return{
                data:{
                    accBranch:null,
                    accName:null,
                    bank:null,
                    number:null
                },
                amount:null,
                flag:false
            }
        },
        methods:{
            turn(){
                this.$router.push({
                    path:'/withdraw/bank'
                })
            },
            deposit(){
                if (!this.amount){
                    showError('请输入提现金额')
                    return
                }
                if (!this.data.accName){
                    showError('请添加开户人')
                    return
                }
                if (!this.data.bank){
                    showError('请添加开户银行')
                    return
                }
                if (!this.data.accBranch){
                    showError('请添加银行分行')
                    return
                }
                if (!this.data.number){
                    showError('请添加银行卡号')
                    return
                }
                let data={
                    amount:this.amount,
                    accName:this.data.accName,
                    bank:this.data.bank,
                    accBranch:this.data.accBranch,
                    number:this.data.number
                }
                console.log(data)
                deposit(data).then(res=>{
                    if (res.code==10000){
                        showCorrect('申请成功')
                        this.$router.push({
                            path:'/my'
                        })
                    }
                })
            }
        },
        activated() {
            eventBus.$on('msg',data=>{
                this.data = data
                this.flag = true
            })
        }
    }
</script>

<style scoped lang="stylus">
.withdraw
    background $page-bg
    .con
        margin-top 47px
        .bankCard
            display flex
            padding 12px
            justify-content space-between
            align-items center
            background-color #fff
            .info
                .card
                    font-size 17px
                    line-height 24px
                    color #333
                .desc
                    font-size 15px
                    color #999
                    line-height 21px
            .control
                color #ccc
                font-size 15px
        .input
             background-color #fff
             padding 12px
            .title
                color  #333
                line-height 24px
                font-size 17px
            .num
                display flex
                align-items center
                margin-top 40px
                padding-bottom 40px
                .rmb
                    font-size 30px
                    font-weight bold
                    margin-right 6px
                input
                    font-size 30px
                input:focus {
                    outline none
                }
        .sub
            margin 80px auto
            width 335px
            height 47px
            line-height 47px
            background-color: #f1c809
            border-radius 5px
            font-size 18px
            text-align center

</style>